<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>聊天室</title>
    <link rel="stylesheet" th:href="@{css/bootstrap.css}">
    <link rel="stylesheet" th:href="@{css/style.css}">
    <link rel="stylesheet" th:href="@{css/common.css}">
    <link rel="stylesheet" th:href="@{css/main.css}"/>
</head>
<body>
<div id="userInfo"></div>
<div class="chat-box">
    <div class="chart-header">
    </div>
    <table class="chart-body">
        <tr>
            <td class="online">
                <div th:insert="~{common::online}"></div>
            </td>
            <td class="content-box">
                <div id="content">聊天内容</div>
            </td>
        </tr>
    </table>
    <table class="chart-footer">
        <form action="" id="chat-form" name="chat-form" method="post">
            <tr>
                <td height="30" align="left">&nbsp;</td>
                <td height="37" align="left">
                    <input name="from" type="hidden"
                           th:value="${#httpServletRequest.getSession().getAttribute('USER').username}"/>
                    <span class="user-username"
                          th:text="${#httpServletRequest.getSession().getAttribute('USER').username}"></span>对
                    <input name="to" type="text" value="所有人" maxlength="35" readonly="readonly">
                    <span>表情</span>
                    <select name="face" class="text_box">
                        <option value="无表情的">无表情的</option>
                        <option value="微笑着" selected>微笑着</option>
                        <option value="笑呵呵地">笑呵呵地</option>
                        <option value="热情的">热情的</option>
                        <option value="温柔的">温柔的</option>
                        <option value="红着脸">红着脸</option>
                        <option value="幸福的">幸福的</option>
                        <option value="嘟着嘴">嘟着嘴</option>
                        <option value="热泪盈眶的">热泪盈眶的</option>
                        <option value="依依不舍的">依依不舍的</option>
                        <option value="得意的">得意的</option>
                        <option value="神秘兮兮的">神秘兮兮的</option>
                        <option value="恶狠狠的">恶狠狠的</option>
                        <option value="大声的">大声的</option>
                        <option value="生气的">生气的</option>
                        <option value="幸灾乐祸的">幸灾乐祸的</option>
                        <option value="同情的">同情的</option>
                        <option value="遗憾的">遗憾的</option>
                        <option value="正义凛然的">正义凛然的</option>
                        <option value="严肃的">严肃的</option>
                        <option value="慢条斯理的">慢条斯理的</option>
                        <option value="无精打采的">无精打采的</option>
                    </select>
                    说：
                </td>
                <td width="189" align="left">&nbsp;&nbsp;字体颜色：
                    <select name="color" size="1" class="text_box" id="select">
                        <option selected>默认颜色</option>
                        <option style="color:#FF0000" value="FF0000">红色热情</option>
                        <option style="color:#0000FF" value="0000ff">蓝色开朗</option>
                        <option style="color:#ff00ff" value="ff00ff">桃色浪漫</option>
                        <option style="color:#009900" value="009900">绿色青春</option>
                        <option style="color:#009999" value="009999">青色清爽</option>
                        <option style="color:#990099" value="990099">紫色拘谨</option>
                        <option style="color:#990000" value="990000">暗夜兴奋</option>
                        <option style="color:#000099" value="000099">深蓝忧郁</option>
                        <option style="color:#999900" value="999900">卡其制服</option>
                        <option style="color:#ff9900" value="ff9900">镏金岁月</option>
                        <option style="color:#0099ff" value="0099ff">湖波荡漾</option>
                        <option style="color:#9900ff" value="9900ff">发亮蓝紫</option>
                        <option style="color:#ff0099" value="ff0099">爱的暗示</option>
                        <option style="color:#006600" value="006600">墨绿深沉</option>
                        <option style="color:#999999" value="999999">烟雨蒙蒙</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td width="21" height="30" align="left">&nbsp;</td>
                <td width="549" align="left">
                    <input name="content" type="text" maxlength="70" value="">
                    <input name="Submit2" type="button" class="btn_grey" value="发送"
                           onClick="send()">
                </td>
                <td align="right"><input name="button_exit" type="button"
                                         class="btn_grey" value="退出聊天室" onClick="exit()">
                </td>
                <td align="center">&nbsp;</td>
            </tr>
            <tr>
                <td height="30" align="left">&nbsp;</td>
                <td colspan="2" align="center" class="word_dark">&nbsp;
                </td>
                <td align="center">&nbsp;</td>
            </tr>
        </form>
    </table>
</div>
</body>
<script th:src="@{js/jquery.js}" type="text/javascript"></script>
<script th:src="@{js/common.js}" type="text/javascript"></script>
<script th:src="@{js/main.js}" type="text/javascript"></script>
</html>